<template lang="pug">
  .mask(v-show='isShow')
    .wrap
      .w-title
        .wt-add 添加公告
        .wt-close(@click="hide()") ×
      .addcompany
        el-form(:model="ruleForm"  :rules="rules" ref="ruleForm" label-width="110px" class="demo-ruleForm")
          el-form-item(label="公告标题" prop="title")
            el-input(v-model="ruleForm.title")
          el-form-item(label="发布时间" prop="date")
            el-date-picker(v-model="ruleForm.date" type="datetime" placeholder="选择日期时间")
          el-form-item(label="发布内容" prop="desc")
            el-input(type="textarea" v-model="ruleForm.desc")
      .btns
        el-button(type="danger" @click="submitForm('ruleForm')") 添加
        el-button(@click="hide()")  取消
</template>
<script>
import qs from 'qs';
export default {
  name:'notice',
  props:['notice'],
  data(){
    return{
      isShow:this.notice,
      ruleForm:{
        title:'',
        date:'',
        desc:''
      },
      rules: {
        title: [
          { required: true, message: '请输入单位码', trigger: 'blur' },
        ],
        desc: [
          { required: true, message: '请输入内容', trigger: 'blur' },
        ],
        date: [
          { type: 'date', required: true, message: '请选择日期', trigger: 'change' }
        ],
      }
    }
  },
  mounted(){
    console.log(qs)
  },
  methods:{
    submitForm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.addnotice()
        } else {
          console.log('error submit!!');
          return false;
        }
      });
    },
    async addnotice(){
      let list = {
        createTime:this.ruleForm.date,
        noticeContent:this.ruleForm.desc
      }
      console.log(list)
      let res = await this.$ajax.post('xyssoManager/notice/insert',list)
      let data = res.data
      if(data.code==200){
        this.$message.success('添加成功')
        this.isShow = false
        this.$parent.getnoticelist()
      }
    },
    hide(){
      this.isShow = false
    }
  },
  watch:{
    notice(cur){
      if(cur==true){
        this.isShow=cur
      }
    }
  }
}
</script>
<style lang="stylus" scoped>
  .mask
    position fixed
    top 0
    left 0
    right 0
    bottom 0
    background rgba(0, 0, 0, 0.5)
    .wrap
      position absolute
      top 50%
      left 50%
      width 400px
      height 354px
      margin-left -200px
      margin-top -177px
      background white
      border-radius 5px
      .w-title
        height 50px
        line-height 50px
        border-bottom 1px solid #eaeaea
        color #333333
        .wt-add
          float left
          font-size 16px
          margin-left 20px
        .wt-close
          float right
          margin-right 20px
          font-size 36px
          color #9d9d9d
          cursor pointer
    .addcompany
      padding 30px 0 20px
      width 350px
      background #ffffff
      .demo-ruleForm
        margin 0 auto
        .el-input
        .el-select
          width 100%
    .btns
      text-align center
      button
        width 76px
</style>


